/*
 * Copyright 2019 ABSA Group Limited
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

@import "../node_modules/font-awesome/less/font-awesome.less";
@import "../node_modules/@fortawesome/fontawesome-free/css/all.min.css";
@import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
@import "../node_modules/cytoscape-panzoom/cytoscape.js-panzoom.css";
@import '~@swimlane/ngx-datatable/release/index.css';
@import '~@swimlane/ngx-datatable/release/themes/material.css';
@import '~@swimlane/ngx-datatable/release/assets/icons.css';

html,
body {
    width       : 100%;
    max-width   : 100%;
    height      : 100%;
    font-family : "Roboto", "Trebuchet MS", Arial, Helvetica, sans-serif;
    color       : #555;
    margin-left : 0 !important;
    margin-right: 0 !important;
    overflow-x  : hidden;
}

.fullHeight {
    height: calc(100vh - 103px);
}

.embeddedHeight {
    height: calc(100vh - 29px);
}


.btn-primary {
    color           : #fff;
    background-color: #337ab7;
    border-color    : #337ab7;
}

.btn-primary:hover {
    background-color: #3787c8;
    border-color    : #3787c8;
}

.btn-link {
    color: #337ab7;
}

.btn-link:hover {
    color: #3787c8;
}

a {
    cursor: pointer;
    color : #303A40;
}

hr {
    background-color: #303A40;
}

.display-none {
    display: none;
}

.display-inline {
    display: inline;
}

.no-padding {
    padding: 0 !important;
}

/** DATATABLE **/

.table td {
    padding: 0 !important;
}

.ngx-datatable.material .datatable-footer .page-count {
    line-height: unset;
    height     : unset;
    padding    : 0 1.2rem;
}

.ngx-datatable.material.single-selection .datatable-body-row.active,
.ngx-datatable.material.single-selection .datatable-body-row.active .datatable-row-group,
.ngx-datatable.material.multi-selection .datatable-body-row.active,
.ngx-datatable.material.multi-selection .datatable-body-row.active .datatable-row-group,
.ngx-datatable.material.multi-click-selection .datatable-body-row.active,
.ngx-datatable.material.multi-click-selection .datatable-body-row.active .datatable-row-group {
    background-color: #f2f2f2 !important;
    color           : #fff;
}

.ngx-datatable.material:not(.cell-selection) .datatable-body-row:hover .datatable-row-group {
    cursor: pointer;
}

.ngx-datatable.material .datatable-body .datatable-row-detail {
    background: #f2f2f2;
}

.tooltipCell {
    white-space  : nowrap;
    overflow     : hidden;
    text-overflow: ellipsis;
    width        : 100%;
}

.datatable-header-cell {
    overflow: hidden;
}

/** Graph **/

.graph {
    background: #FFF;
    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
    float     : left;
    width     : 100%;
}

.cxtmenu-disabled {
    opacity: 0.35;
}

/** Expressions **/

.expression {
    font-size: 90%;
}

code {
    background-color: #ffffff;
    border-radius   : 3px;
    font-size       : 80%;
    color           : #337ab7;
    font-family     : courier, monospace;
    padding         : 0 3px;
}

pre span {
    white-space: normal;
}

.string {
    color: #337ab7;
}

.number {
    color: darkorange;
}

.boolean {
    color: blue;
}

.null {
    color: magenta;
}

.key {
    color: #303A40;
}

/** scrollbar **/
::-webkit-scrollbar {
    width : 7px;
    height: 7px;
}

::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 5px rgba(48, 58, 44, 0.4);
    box-shadow        : inset 0 0 5px rgba(48, 58, 44, 0.4);
}

::-webkit-scrollbar-thumb:hover {
    background: #303A40;
}


.star-s:before {
    font-family: 'Font Awesome 5 Free';
    content    : "\f005";
    font-weight: 900;
}

/** Material overides */
.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
    width           : 60px !important;
    background-color: white;
}


.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
    width                     : 30px;
    background-color          : #428bca;
    margin-left               : 12px;
    border-top-right-radius   : 2px !important;
    border-bottom-right-radius: 2px !important;
}

.mat-slide-toggle-bar {
    border          : 1px solid #ccc;
    height          : 22px !important;
    width           : 60px !important;
    background-color: white;
    border-radius   : 3px !important;
}


.mat-slide-toggle-thumb {
    box-shadow      : none !important;
    border-radius   : 0% !important;
    background-color: #eee;
    height          : 20px !important;
    width           : 30px !important;
    margin-top      : 3px;
}

.mat-slide-toggle:not(.mat-checked) .mat-slide-toggle-thumb {
    border-top-left-radius   : 2px !important;
    border-bottom-left-radius: 2px !important;
}

.mat-slide-toggle-thumb-container {
    cursor: pointer !important;
}

.mat-slide-toggle {
    &.mat-checked {
        .mat-slide-toggle-bar::after {
            content  : 'On' !important;
            font-size: 12px !important;
            color    : white !important;
            position : absolute !important;
            left     : 35px !important;
            top      : -2px !important;
            z-index  : 1000;
        }
    }

    &:not(.mat-checked) {
        .mat-slide-toggle-bar::after {
            content  : 'Off' !important;
            font-size: 12px !important;
            color    : gray !important;
            position : absolute !important;
            left     : 5px !important;
            top      : -2px !important;
            z-index  : 1000;
        }
    }
}